import React from 'react';
import Upload from './Upload';
import Icon from './Icon';
import './style.css';
// import './style.css';
// import Cropper from 'react-cropper';
import 'cropperjs/dist/cropper.css';
// import { dataURL2File, previewFile } from './utils';
import { Button } from 'antd';

export default class UploadOss extends React.Component {
    getUploadOptions() {
        return {
            action: file =>
                new Promise((resolve, reject) => {
                    fetch(
                        'http://172.16.6.235:39001/VV-RESORCE-SERVICE/api/resource/public/oss/producePutPreSignUrls',
                        {
                            method: 'POST',
                            body: JSON.stringify({
                                sysCode: 'OA', // OA,
                                fileNames: [file.name]
                            }),
                            headers: {
                                'Content-Type': 'application/json'
                            }
                        }
                    )
                        .then(async response => {
                            const res = await response.json();
                            console.log(res, 'resresresresresres');

                            if (res.code === 10000) {
                                resolve(res.data[0].preUrl);
                            } else {
                                reject(res);
                            }
                        })
                        .catch(err => {
                            reject(err);
                        });
                }),
            headers: {
                'Content-Type': 'application/octet-stream'
            },
            method: 'PUT',
            multiple: true,
            beforeUpload: file => {
                //
            },
            onProgress: (e, file) => {
                console.log('onProgress::::', e, file);
            },
            onError: (e, response, file) => {
                console.log('onError::::', e, response, file);
            }
        };
    }

    state = {
        cropperBuffer: null,
        selectedFile: null,

        fileList: [
            {
                uid: '00',
                name: 'jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png',
                url: 'http://www.kreedoo.com/mailTplImages/logo.png',
                type: 'image/png',
                state: 'uploaded'
            },
            {
                uid: '01',
                name: 'abcd.png',
                url: 'http://www.dlslslsl.com/abcd.png',
                state: 'uploaded'
            }
        ]
    };

    cropperBuffer = '';

    saveCropperUploaderRef = ref => {
        this.uploaderRef = ref;
    };

    saveCropperRef = ref => {
        this.cropperRef = ref;
    };

    saveUploaderRef1 = ref => {
        this.uploaderRef1 = ref;
    };

    render() {
        const { value, onChange } = this.props;
        const button = (
            <div className="button">
                <Icon type="upload" /> Click to Upload
            </div>
        );
        const titleStyle = {
            marginTop: 20,
            borderTop: '1px solid #efefef',
            paddingTop: 10,
            fontSize: 16,
            marginBottom: 10
        };
        return (
            <Upload
                {...this.getUploadOptions()}
                listType="image"
                ifShowDownload={false} // 是否显示下载按钮
                ifShowPreview={false} // 是否显示预览按钮
                ifShowRemove={false}
                ref={this.saveUploaderRef1}
                value={value}
                onChange={onChange}
            >
                <Button className="button">
                    <Icon type="plus" /> Upload
                </Button>
            </Upload>
        );
    }
}
